import React, {Component} from 'react';
import {SearchBody, SearchContentWrapper} from "../style";
import { connect } from 'react-redux';
import {actionCreators} from "../store";

class SearchContent extends Component {

  render() {
    const { data ,addClickNum} = this.props;
    return (
      <SearchBody>
        { data.map( (item) => {

          return (
            <SearchContentWrapper key={item.get('id')}>
              <p style={{cursor:'pointer'}} onClick={()=> addClickNum(item.get('id'))}>{item.get('title')}</p>
              <span className={'content'}>{item.get('content')}</span>
              <span className={'date'}>{item.get('date')}</span>
            </SearchContentWrapper>
          )
        })}
      </SearchBody>
    )


  }
}
const mapStateToProps = (state)=> {
  return {
    data: state.get('search').get('data'),
  }
}
const mapDispatchToProps = (dispatch) =>{
  return {
    addClickNum(id){
      dispatch(actionCreators.addClickNum(id))
    }
  }
}
export default connect(mapStateToProps,mapDispatchToProps)(SearchContent)
